<template>
  <div>
    <p class="desc">选择能发起该审批的人员/部门，不选则默认开放给所有人</p>
    <el-button size="mini" @click="selectOrg" icon="el-icon-plus" type="primary" round>请选择</el-button>
    <org-items v-model="select"/>
    <org-picker title="请选择可发起本审批的人员/部门" multiple ref="orgPicker" :selected="select" @ok="selected"/>
  </div>
</template>

<script setup>
import OrgPicker from "../../../../components/OrgPicker.vue";
import OrgItems from "../OrgItems.vue";


import {defineProps,ref, defineEmits,reactive, toRefs, nextTick, onMounted,computed,getCurrentInstance,onBeforeUnmount} from 'vue';

import { useStore } from 'vuex'
const store = useStore()
import {useRouter} from 'vue-router'
const router = useRouter()

const { proxy } = getCurrentInstance()

const emit = defineEmits(['insertNode'])

const showOrgSelect = ref(false);


const props = defineProps({
  config:{
    type: Object,
    default: () => {
      return {}
    }
  }
})

const select = computed(()=>{
  return this.config.assignedUser
})


function selectOrg() {
  proxy.$refs.orgPicker.show()
}
function selected(select) {
  select.length = 0
  select.forEach(val => this.select.push(val))
}
function removeOrgItem(index){
  select.splice(index, 1)
}
</script>

<style lang="less" scoped>
.desc{
  font-size: small;
  color: #8c8c8c;
}
.org-item{
  margin: 5px;
}
</style>
